<template>
  <!--  1.app.vue页面可以用来做布局使用
        2.<router-view/>就是路由指令
        3.会把路由到的页面展示/替换到 <router-view/>位置
    <nav>
      <router-link to="/">Home</router-link> |
      <router-link to="/about">About</router-link>
    </nav>
    <router-view/>
  -->
  <div>
    <!--   引入Header组件/页面【头部】-->
    <Header/>
    <div style="display: flex">
      <!--      侧边栏-->
      <Aside/>
      <!--      内容区域，这个部分通过路由来进行展示，默认路由到HomeView.vue
      即 http://localhost:10001/ ===>  HomeView.vue
      如果是 http://localhost:10001/about  【会按照你配置的路由进行访问】===> AboutView.vue
      -->
      <router-view style="flex: 1"/>
    </div>

  </div>

</template>
<script>
import Header from "@/components/Header";
import Aside from "@/components/Aside";

export default {
  name: "Layout",
  components: {
    Header, Aside
  }
}
</script>

<style>

</style>
